import React, { PureComponent } from 'react';
import { Icon, Form } from 'antd';
import { connect } from 'dva';
import "./form.less"
import "../../Common.less"
import { requestFullScreen, exitFull } from "../../utils/fullScreen"
class BeamLenModal extends PureComponent {
    constructor(props) {
        super(props);
        this.state = {
            max:0,
            tdata: null,
            beamLengths: [],
            roadlist: [],
            arrt:[]
        }
        this.onConfirm = this.onConfirm.bind(this)
    }
    onConfirm(params = {}) {
        if (params.onSuccess) {
            params.onSuccess();
        }
    }
    componentDidMount() {
        if (this.props.onLoaded) {
            this.props.onLoaded(this)
        }
        let arr = [], arr2 = [],marr=[];
        let collen, collen2,max;
        const { beamLengths, beamCantilever } = this.props.extra.tdata;
        const len = beamLengths.length;
        const len2 = beamCantilever.length;
        for (let i = 0; i < len; i++) {
            let item = beamLengths[i];
            const len2 = item.lengths.length;
            if (i == 0) {
                collen = len2
            }
            let obj = {
                id: item.id,
                endIntersectAngle: item.endIntersectAngle,
                endStation: item.endStation,
                leftSlope: item.leftSlope,
                rightSlope: item.rightSlope,
                startIntersectAngle: item.startIntersectAngle,
                startStation: item.startStation,
                position:item.position
            }
            for (let j = 0; j < len2; j++) {
                let item2 = item.lengths[j];
                obj['length' + j] = item2
            }
            arr.push(obj)

        }
        for (let i = 0; i < len2; i++) {
            let item = beamCantilever[i];
            const len = item.llLengths ? item.llLengths.length : 0;
            const len2 = item.lrLengths ? item.lrLengths.length : 0;
            const len3 = item.rlLengths ? item.rlLengths.length : 0;
            const len4 = item.rrLengths ? item.rrLengths.length : 0;
            marr.push(len,len2,len3,len4);
            if (i == 0) {
                collen2 = len;
            }
            let obj = {
                id: item.id,
                position:item.position
            }
            for (let j = 0; j < len; j++) {
                let item2 = item.llLengths[j];
                obj['llLengths' + j] = item2
            }
            for (let j = 0; j < len2; j++) {
                let item2 = item.lrLengths[j];
                obj['lrLengths' + j] = item2
            }
            for (let j = 0; j < len3; j++) {
                let item2 = item.rlLengths[j];
                obj['rlLengths' + j] = item2
            }
            for (let j = 0; j < len4; j++) {
                let item2 = item.rrLengths[j];
                obj['rrLengths' + j] = item2
            }
            arr2.push(obj)

        }
        max=Math.max.apply(null,marr)
        let arrt = [];
        const lenn = arr2.length;
        for (let i = 0; i < lenn; i++) {
            let item = arr2[i];
            let tobj1 = {
                id: item.id,
                index:i+1,
                position:item.position,
                xb: "左左悬臂"
            }, tobj2 = { xb: "左右悬臂" }, tobj3 = { xb: "右左悬臂" }, tobj4 = { xb: "右右悬臂" };
            let keys = Object.keys(item);
            const len2 = keys.length;
            for (let j = 0; j < len2; j++) {
                let item2 = keys[j];
                if (item2.includes("llLengths")) {
                    tobj1[item2] = item[item2]
                }
                if (item2.includes("lrLengths")) {
                    tobj2[item2] = item[item2]
                }
                if (item2.includes("rlLengths")) {
                    tobj3[item2] = item[item2]
                }
                if (item2.includes("rrLengths")) {
                    tobj4[item2] = item[item2]
                }
            }
            if(Object.keys(tobj1).filter(item=>item.includes("llLengths")).length<max){
                tobj1["llLengths99"]="---"
            }
            if(Object.keys(tobj2).filter(item=>item.includes("lrLengths")).length<max){
                tobj2["lrLengths99"]="---"
            }
            if(Object.keys(tobj3).filter(item=>item.includes("rlLengths")).length<max){
                tobj3["rlLengths99"]="---"
            }
            if(Object.keys(tobj4).filter(item=>item.includes("rrLengths")).length<max){
                tobj4["rrLengths99"]="---"
            }
            arrt.push(tobj1,tobj2,tobj3,tobj4)
        }
        this.setState({
            max,
            collen,
            collen2,
            beamLengths: arr,
            beamCantilever: arr2,
            arrt
        })

    }
    render() {
        const { beamLengths, max, collen, arrt,exit} = this.state;
        return (
            <div id="beamLenModal" style={{ height: "60vh", overflow: "auto" }} className="BeamLenModal tableBoxS tcBox">
                {
                    !exit? <Icon onClick={e => {
                        this.setState({
                            exit:true
                        })
                        requestFullScreen(document.querySelector(".ant-modal"))
                        
                        document.querySelector(".BeamLenModal").style.height="calc(100vh - 85px)"
                        document.querySelector(".ant-modal-body").style.height="calc(100vh - 70px)"
                    }} className="fullScreen" type="fullscreen" />: <Icon onClick={e =>{
                        this.setState({
                            exit:false
                        })
                        exitFull()
                        document.querySelector(".BeamLenModal").style.height="calc(70vh - 85px)"
                        document.querySelector(".ant-modal-body").style.height="calc(70vh - 70px)"
                    }} className="fullScreen" type="fullscreen-exit" />
                }
               
               
                <table>
                    <tbody>
                        <tr className="th">
                            <td>位置</td>
                            <td>起点桩号(m)</td>
                            <td>终点桩号(m)</td>
                            {
                                Array.from(Array(collen), (item, index) => {
                                    return <td key={'th1' + index}>梁长{index + 1}</td>
                                })
                            }
                            <td>起点交角(度)</td>
                            <td>终点交角(度)</td>
                            <td>坡度i(%)</td>
                        </tr>
                        {
                            beamLengths && beamLengths.length ? beamLengths.map((item, index) => {
                                return <tr key={'tr1' + index}>
                                    <td>{item.position}</td>
                                    <td>{item.startStation}</td>
                                    <td>{item.endStation}</td>
                                    {
                                        Object.keys(item).map((key,i)=>{
                                            return key.replace(/[0-9]/g,"")=="length"?<td key={'td1'+i}>{item[key]}</td>:undefined
                                        })
                                    }
                                    <td>{item.startIntersectAngle}</td>
                                    <td>{item.endIntersectAngle}</td>
                                    <td>{item.leftSlope}</td>
                                </tr>
                            }) : undefined
                        }
                    </tbody>
                </table>
                <table style={{ marginTop: "15px" }}>
                    <tbody>
                        <tr className="th">
                            <td>位置</td>
                            <td style={{minWidth:"80px"}}>悬臂</td>
                            {
                                Array.from(Array(max), (item, index) => {
                                    return <td key={'th2' + index}>悬臂段长{index + 1}</td>
                                })
                            }
                        </tr>
                        {
                            arrt && arrt.length ? arrt.map((item, index) => {
                                return <tr key={'tr2' + index}>
                                    {
                                        item.id?<td rowSpan={4}>{item.position}</td>:undefined
                                    }
                                    
                                    <td>{item.xb}</td>
                                    {
                                        Object.keys(item).map((key, i) => {
                                            return key.includes("Length") ? <td key={'td2' + i}>{item[key]}</td> : undefined
                                        })
                                    }
                                </tr>
                            }) : undefined
                        }
                    </tbody>
                </table>
            </div>
        );
    }
}

export default connect(
    ({
        project: { current }
    }) => {
        return { project: current };
    },
    dispatch => ({
        loadProjectRoads: (values) => dispatch({
            type: 'refRoads/loadProjectRoads',
            payload: values
        }),

    })
)(Form.create('BeamLenModal', {

})(BeamLenModal));